import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'
import { getBannerRequest } from '../service/recommend'

export const fetchBannerDataAction = createAsyncThunk('banners', async (arg, { dispatch }) => {
	const res = await getBannerRequest()
	dispatch(changeBannersAction(res.banners))
})

interface IRecommendState {
	banners: any[]
}

const initialState: IRecommendState = {
	banners: []
}

const recommendSlice = createSlice({
	name: 'recommend',
	initialState,
	reducers: {
		changeBannersAction(state, action) {
			state.banners = action.payload
		}
	}
	// extraReducers: (buider) => {
	// 	buider
	// 		.addCase(fetchBannerDataAction.pending, () => {
	// 			console.log('pedding')
	// 		})
	// 		.addCase(fetchBannerDataAction.fulfilled, (state, action) => {
	// 			state.banners = action.payload
	// 			console.log('fulfilled')
	// 		})
	// 		.addCase(fetchBannerDataAction.rejected, () => {
	// 			console.log('rejected')
	// 		})
	// }
})

export const { changeBannersAction } = recommendSlice.actions
export default recommendSlice.reducer
